From 1eee181e219dfd993d396ac3169e7aad3dd285eb Mon Sep 17 00:00:00 2001 From: Factiven Date: Sun, 16 Jul 2023 22:35:39 +0700 Subject: Update v3.6.4 - Added Manga page with a working tracker for AniList user - Added schedule component to home page - Added disqus comment section so you can fight on each other (not recommended) - Added /id and /en route for english and indonesian subs (id route still work in progress) --- pages/en/manga/[id].js | 172 +++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 172 insertions(+) create mode 100644 pages/en/manga/[id].js (limited to 'pages/en/manga/[id].js') diff --git a/pages/en/manga/[id].js b/pages/en/manga/[id].js new file mode 100644 index 0000000..5e46599 --- /dev/null +++ b/pages/en/manga/[id].js @@ -0,0 +1,172 @@ +import dotenv from "dotenv"; +import ChapterSelector from "../../../components/manga/chapters"; +import HamburgerMenu from "../../../components/manga/mobile/hamburgerMenu"; +import Navbar from "../../../components/navbar"; +import TopSection from "../../../components/manga/info/topSection"; +import Footer from "../../../components/footer"; +import Head from "next/head"; +import { useEffect, useState } from "react"; +import { setCookie } from "nookies"; +import { getServerSession } from "next-auth"; +import { authOptions } from "../../api/auth/[...nextauth]"; + +export default function Manga({ info, userManga, chapters }) { + const [domainUrl, setDomainUrl] = useState(""); + const [firstEp, setFirstEp] = useState(); + const chaptersData = + info.chapters.data.length === 0 ? chapters : info.chapters.data; + + useEffect(() => { + setDomainUrl(window.location.origin); + }, []); + + return ( + <> + + + {info + ? `Manga - ${ + info.title.romaji || info.title.english || info.title.native + }` + : "Getting Info..."} + + + + + + +
+ + +
+
+ + <> +
+
+ +
+
+ {chaptersData.length > 0 ? ( + + ) : ( +

No Chapter Available :(

+ )} +
+
+
+ + ); +} + +export async function getServerSideProps(context) { + dotenv.config(); + + const session = await getServerSession(context.req, context.res, authOptions); + + const { id } = context.query; + const key = process.env.API_KEY; + const res = await fetch(`https://api.anify.tv/info/${id}?apikey=${key}`); + const data = await res.json(); + + let userManga = null; + + if (session) { + const response = await fetch("https://graphql.anilist.co/", { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify({ + query: ` + query ($username: String, $status: MediaListStatus) { + MediaListCollection(userName: $username, type: MANGA, status: $status, sort: SCORE_DESC) { + user { + id + name + } + lists { + status + name + entries { + id + mediaId + status + progress + score + progressVolumes + media { + id + status + title { + english + romaji + } + episodes + coverImage { + large + } + } + } + } + } + } + `, + variables: { + username: session?.user?.name, + }, + }), + }); + const data = await response.json(); + const user = data?.data?.MediaListCollection; + const userListsCurrent = user?.lists.find((X) => X.status === "CURRENT"); + const matched = userListsCurrent?.entries.find( + (x) => x.mediaId === parseInt(id) + ); + if (matched) { + userManga = matched; + } + } + + if (!data?.chapters) { + return { + notFound: true, + }; + } + + let chapter = null; + + if (data?.chapters?.data.length === 0) { + const res2 = await fetch( + `https://api.anify.tv/chapters/${id}?apikey=${key}` + ); + const data2 = await res2.json(); + chapter = data2; + } + + return { + props: { + info: data, + userManga, + chapters: chapter || null, + }, + }; +} -- cgit v1.2.3